<template lang="pug">
  v-data-table( :headers="headers"
    v-model="selected"
    show-select
    :options.sync="options"
    :items="items"
    loading-text="数据加载中..."
    no-data-text="未找到数据"
    :server-items-length="totalItems"
    :footer-props="footerProps"
    :loading="isLoading"
  )
    template(v-slot:item.action='{ item }')
      v-menu(bottom right)
        template(v-slot:activator="{ on, attrs }")
          v-btn(depressed fab dark x-small color="primary" v-bind="attrs" v-on="on")
            v-icon mdi-dots-vertical
        v-list
          v-list-item(@click="edit(item)")
            v-list-item-title 编辑
          v-list-item(@click="deleteBundle(item)")
            v-list-item-title 删除
</template>

<script lang="ts">
  import Vue from 'vue'
  import mixins from '../mixins/PaginateDataTableMixin'
  import {mapState, mapMutations, mapGetters, mapActions} from 'vuex'

  export default Vue.extend({
    mixins: [mixins],
    methods: {
      ...mapActions('filterableBundle', { fetchData: 'list', del: 'delete' }),
      edit(item: any) {
        this.$emit('edit', item)
      },
      deleteBundle(item:any) {
        this.$confirm({
          body: `确认删除  ${item.name}？`
        }).then(() => {
          this.doDelete(item)
        })
      },
      doDelete(item: any){
        this.$loading()
        this.del(item.id).then(response => {
          var ret = response.data.result
          if (!ret.success) {
            this.$msgBox(ret.message)
          } else {
            this.refresh()
          }
          this.$loading.close()
        })
      }
    },
    data() {
      return {
        assetStock: null,
        headers: [
          { text: '操作', value: 'action', sortable: false },
          { text: '名称', value: 'name', width: 200 },
          { text: '描述', value: 'description' }
        ]
      }
    }
  })
</script>
